<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--为html标签绑定事件(click等)-->
    <!--语法：v-on:事件名="函数名" 简写为@事件名="函数名"，函数都定义到methods中-->
    <div id="app">
        <button v-on:click="money">点我有惊喜</button>
        <button @click="love">点我更多惊喜</button>
    </div>
</body>
<script type="module">
    //导入vue模块
    import {createApp} from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'
    //创建应用实例
    createApp({
        data(){
            return {
                //定义数据
            }
        },
        methods: {
            //定义函数
            money:function(){
                alert("送你100")
            },
            'love':function(){//加不加''效果一样
                alert("送你1000")
            }
        },
    }).mount('#app')//控制页面元素
</script>
</html>